﻿/*DROP DOWN LIST*/
/*
Add by Quang 
10/02/2010
Thay the cac element select mac dinh bang Select kieu moi

function loadDDLs() {
    var ddlDate = new ddlDD_Detail();
    ddlDate.initializeCtrl('ddlDate', onLoadDDL_Detail, onClickDDL_Detail);
    var ddlMonth = new ddlDD_Detail();
    ddlMonth.initializeCtrl('ddlMonth', onLoadDDL_Detail, onClickDDL_Detail);
    var ddlYear = new ddlDD_Detail();
    ddlYear.initializeCtrl('ddlYear', onLoadDDL_Detail, onClickDDL_Detail);
    var ddlPopupEmail = new ddlDD_Detail();
    ddlPopupEmail.initializeCtrl('ddlPopupEmail', onLoadDDL_Detail, onClickDDL_Detail);
    var ddlPopupEmail_ddl = new ddlDD_Detail();
    ddlPopupEmail_ddl.initializeCtrl('ddlPopupEmail_ddl', onLoadDDL_Detail, onClickDDL_Detail);

};

*/
/*
Add by Quang 
10/02/2010
Ham duoc goi khi tao Select kieu moi
*/
function onLoadDDL_Detail(obj) {
    if (obj.scroller == null) {
        var id = obj.targetID;
        //obj.scroller = new Scrolling.Scroller($(id + '_ddlScroller'), 400, 165);
        //obj.scrollbar = new Scrolling.Scrollbar($(id + '_ddlScrollbar'), obj.scroller, new Scrolling.ScrollTween());
    }
};

/*
Add by Quang 
10/02/2010
Event click tren Dropdownlist
*/
function onClickDDL_Detail(id, value) {
    var selectedValue = value;
    //hoac lay gia tri tu dropdown cung dc
    //alert($(id).value)
};

/*
Add by Quang 
10/02/2010
Object Dropdownlist
*/
var ddlDD_Detail = Class.create({
    initialize: function() {
        this.targetID = null;
        this.DDL = null;
        this.selectedValue = '';
        this.onClickHandle = null;
        this.onLoadHandle = null;
        this.scroller = null;
        this.scrollbar = null;
        this.DDLList = null;
    },
    /*
    Add by Quang 
    10/02/2010
    Ham khoi tao
    */
    initializeCtrl: function(targetID, onLoadHandle, onClickHandle, isSmall) {
        var select = $(targetID);
        if (select) {
            this.targetID = targetID;
            this.onClickHandle = onClickHandle;
            this.onLoadHandle = onLoadHandle;
            this.loadHtml(select, isSmall);
        }
    },
    /*
    Add by Quang 
    10/02/2010
    Ham thay the noi dung html
    */
    loadHtml: function(objSelect, isSmall) {
        var id = this.targetID;
        var objSelected = objSelect.options[objSelect.selectedIndex];
        this.selectedValue = objSelected.value;
        //edit here 24/03
        var html = "";
        html = "<div class='f-txt-bg'>" +
                    '<span  id="' + id + '_SV" class="value-selected" UNSELECTABLE="on">' + objSelected.text + '</span>' +
                    "<i class='f-txt-btn'></i>" +
                    "<div class='list-select' id='listSelectDetail'>" +
                        '<ul id="' + id + '_ddlScroller" >';
        for (var i = 0, len = objSelect.options.length; i < len; i++) {
            var option = objSelect.options[i];
            html += '<li id="' + id + '_' + option.value + '">' + option.text + '</li>';
        }
        html += "</ul>" +
                    "</div>" +
                "</div>";
        //Quang 23/02        
        this.DDL = new Element('div', { 'id': id + '_ddl', 'class': 'select' + (!isSmall ? '' : ' select_small'), 'style': 'width:' + (objSelect.getWidth() - 36) + 'px;position:relative;' }).update(html); // 16.4.12
        objSelect.insert({ 'before': this.DDL }).hide();
        if (this.onLoadHandle && typeof (this.onLoadHandle) == 'function') {
            this.onLoadHandle(this);
        }

        if ($("listSelectDetail")) {
            $("listSelectDetail").hide();
        }
        this.loadEvents();
    },
    /*
    Add by Quang 
    10/02/2010
    Gan events cho dropdownlist
    */
    loadEvents: function() {
        this.DDL.observe('click', this.DDLClick.bindAsEventListener(this));
        document.observe('click', this.docClick);
    },
    /*
    Add by Quang 
    10/02/2010
    Event click tren ddl
    */
    DDLClick: function(e) {
        var ele = Event.element(e);
        while (ele.id == '') ele = ele.up();
        if (ele.id == this.targetID + '_SV' || ele.id == this.targetID + '_ddl') {
            var ddlList = $("listSelectDetail");
            if (ddlList.visible()) ddlList.hide();
            else {
                this.docClick(e);
                ddlList.show();
            }
        }
        else if (ele.tagName == 'LI') {
            var newValue = ele.id.replace(this.targetID + '_', '');
            if (this.selectedValue != newValue) {
                this.selectedValue = newValue;
                $(this.targetID).value = this.selectedValue;
                if (this.onClickHandle && typeof (this.onClickHandle) == 'function') {
                    this.onClickHandle(this.targetID, this.selectedValue);
                }
                $("ddlEmailDetail_SV").update(ele.innerHTML);
            }
            if ($("listSelectDetail")) {
                $("listSelectDetail").hide();
            }
        }
        Event.stop(e);
    },
    /*
    Add by Quang 
    10/02/2010
    Event click tren 1 element khac ddl, hide ddl di
    */
    docClick: function(e) {
        $(document.body).select('.list-select').invoke('hide');
    }
});
/*END DROP DOWN LIST*/


